<!DOCTYPE html>
<html>
    <head>
        {% block head %}
            <link rel="icon" sizes="16x16" href="{{ asset('favicon.ico') }}" />
            <link rel="stylesheet" href="{{ asset('/public/bootstrap-3.2.0/dist/css/bootstrap.css') }}" />
            <link rel="stylesheet" href="{{ asset('/public/bootstrap-3.2.0/dist/css/bootstrap-theme.css') }}" />
            <link rel="stylesheet" href="{{ asset('/public/font-awesome-4.1.0/css/font-awesome.css') }}" />
            <link rel="stylesheet" type="text/less" href="{{ asset('/public/less/style.less') }}" />
            <script type="text/javascript" src="{{ asset('/public/js/jquery-1.11.1.js') }}"></script>
            <script type="text/javascript" src="{{ asset('/public/less.js-1.7.3/dist/less-1.7.3.js') }}"></script>
            <script type="text/javascript" src="{{ asset('/public/bootstrap-3.2.0/dist/js/bootstrap.js') }}"></script>
            <script type="text/javascript" src="{{ asset('/public/js/main.js') }}"></script>
            <title>{% block title %}Bigspender{% endblock %}</title>
        {% endblock %}
    </head>
    <body>
        <div id="flash-message" class="{{app.session.flashbag.getName()}}">
            <ul class="no-margin">        
                {% for flashMessage in app.session.flashbag.get('message') %}
                    <li>{{ flashMessage }}</li>
                {% endfor %}
            </ul>
        </div>
        {% if app.user %}
            <div id="top-bar">
                <div class="col-md-12 text-right">
                    <a href="{{path('user_edit')}}" class="btn btn-primary" id="user-edit" data-toggle="popover">
                        {{ app.user.username }}            
                    </a>
                    <a href="{{path('_logout')}}" class="btn btn-danger">
                        {% trans %}LOG OUT LINK{% endtrans %}
                    </a>
                </div>
                <div class="clearfix"></div>
            </div>
        {% endif %}
        {% block body %}
            {% block content %}{% endblock %}
        {% endblock %}
        <script>
        $(document).ready(function() {
            $('#user-edit')
                .popover({
                    trigger: 'click',
                    container: 'body',
                    placement: 'bottom',
                    html: true,
                    content: '{% include "BigspenderDefaultBundle::user-edit.html.twig" %}'
                }).on('click', function (event) {
                    event.preventDefault();
                });
        });
        </script>
    </body>
</html>
